| The non appearance of embedded values in text | Deployment UI Options | |
Knowledge Builder provides developers with the ability to customise the look and feel of their web applications. This section describes how this customisation can be implemented using a combination of Dialog Properties and external CSS file.
Dialog Design
A single Dialog Object in Knowledge Builder can be used to capture the values of one or more Knowledge Builder Object (or Variable) on a single web page. Dialogs can also used to display information and reports. An Application can have any number of Dialogs, which are invoked as and when they are encountered by the application logic.
The Knowledge Builder Dialog editor allows the style and content of a Dialog object to defined by the developer.
1.1 Dialogs for Data Capture
Knowledge Builder Objects and Variables can be tied to various types of Dialog Controls. Different Dialog Controls provide different ways of capturing the same data at runtime.
· Controls for List & Boolean Objects
· Listbox
· Listbox (values as hyperlinks)
· Drop-down ComboBox,
· Radio Buttons,
· Check-box,
· Hotspots,
· Grid
· Numeric Editor Control is used to capture values for Numeric Objects
· Date Control is used to capture values for Date Objects
· Variable Editor Control is used to capture values for String & Numeric Variables
1.2 Generic Capture Dialogs
This is a technique whereby a single dialog is used by a number of Objects, which are to be captured as and when they are encountered during inference (one-at-a-time).
For List, Boolean, Numeric & Date Object capture, this is achieved by tying the same Dialog to all the required Objects and by not specifying a TiedItem for the Control used on this dialog. Note that a dialog object can also be tied to a Base Class which then shared by all its child objects)
This un-tied control will dynamically (at runtime) acquire the name of the Object whose TiedDialog property is set to the Dialog name that contains the control.
To share the same dialog for multiple text capture (using String Variables) the "Variable Template Dialog" of a Knowledge Module must be set to the generic Dialog and by not specifying a TiedItem for the Variable Edit control (none).
A Label control can also be used to display the value of any property (of the dynamically allocated Object) by embedding the name of the property, proceeded by two underscore characters. E.g. {__description} to display the description of the Object.
Alternative List Control (Hyperlink Jumps)
A List control can also be displayed as a list of hyperlink jumps (AltControlType=true). Clicking on a link is equivalent to selecting the Object value represented by this link and clicking an (implied) OK button to leave the dialog. Therefore this feature should only be used to capture one List or Boolean Object per Dialog.
Additional Dialog Control Features
·Help Text. If the (helpText) property of an Object contains text then (at runtime) a special icon will appear next the control it is tied to. On clicking this icon, the text is displayed in a special help text window. The icon image can be set via the CssClassName (see section on using CSS)
·Missing Data Indicators. If an attempt is made to exit a dialog (e.g. via OK button) without capturing all the mandatory date, then a special icon will appear next to the controls requiring a value. The icon image can be set via the CssClassName (see section on using CSS)
·Invalid Values. For Knowledge Builder Editions supporting constraint inference, the following is applicable
·An invalid list value is displayed in grey and cannot be selected (showInvalid=true & allowInvalid=false)
·An invalid list value is not displayed (showInvalid=false)
·A selected invalid list value (showInvalid=true & allowInvalid=true) is displayed in red
·An invalid Numeric value is displayed in red
1.3 Dialogs for Data Display
There are 3 controls, which can be used to display information: Label, Image & Web Page.
| Control | Type of Information Display | |
| Label | Text
HTML/JavaScript Borders |
Embed Object Values
Embed Functions Scrolling Option Display Property of dynamically allocated object |
| Image | bmp, jpegs, gif, ico, png,
wmf & emf |
|
| Web Page (iframe) | URL |
1.4 Actions
User-triggered Actions
| Control | Type of Action | Comments |
| Button | OK, BACK, URL & Exit
Macro (for XpertRule commands) |
"Invisible" isArea |
| Label | JavaScript code | With access to XRKB variables via (SetValue) & (GetValue) api functions |
| Listbox,
Drop-down Combobox, Radio Buttons, Check-boxes, Hotspots & Grid |
XpertRule Commands via
OnUpdate Event of tied Object (fired when a value is selected or deselected) |
XRKB Commands |
| Numeric Edit,
Date Edit |
XpertRule Commands via
OnUpdate Event of tied Object (fired when a value is changed & the focus is moved off the control) |
XRKB Commands |
| Variable Editor | XpertRule Commands via
OnChange Event Procedure tied to Control |
XRKB Commands |
Dialog Event-driven Actions
·OnEnter Event Procedure
·OnCanExit Event Procedure
·OnExit Event Procedure
·Timeout (exit after specified number of seconds)
1.5 Using the Tab Control
A Tab Control allows other Controls to be grouped into multiple tab sheets (of the same web page). The Controls on the active sheet are displayed and the user can select other active sheets to reveal their controls. A Dialog can contain a number of different Tab Controls (each with multiple sheets). Controls placed outside a Tab Control will appear at runtime regardless of active tab sheet.
1.6 Dialog Design Inheritance
A new Dialog object can be defined as "child" dialog of any existing dialog Object. The Child dialog inherits all the controls of the parent dialog. The inherited controls can only be modified from the parent dialog.
1.7 Using Cascading Stylesheets (CSS)
·CSS development
·CSS / jQuery UI development
1.8 Dialog Preview
The Dialog Editor allows the developer to preview the runtime look and feel of a Dialog, by rendering a stand-alone page via the default Web Browser